<template>
  <el-dialog
    @close="cancel"
    :visible.sync="dialog"
    width="660px"
    class="dialogClass"
    append-to-body
  >
    <template slot="title">
      <div class="modalTitle">
        <img
          src="../../../../assets/bluelogo/drawerTitle.png"
          alt=""
          class="titleLogo"
        />{{ title }}
      </div>
    </template>
    <!-- 详情 -->
    <div class="modalCard">
      <div class="titlefangkuai">
        <div class="fangkuai"></div>
        <div class="Header">已处理业务协同基本信息</div>
      </div>
      <el-descriptions
        class="descriptions"
        :column="1"
        size="medium"
        labelClassName="label"
        contentClassName="content"
      >
        <el-descriptions-item label="申请单位">{{
          this.formData.deptName
        }}</el-descriptions-item>
        <el-descriptions-item label="协同案件">{{
          this.formData.caseName
        }}</el-descriptions-item>
        <el-descriptions-item label="协同任务">{{
          this.formData.taskName
        }}</el-descriptions-item>
        <el-descriptions-item label="申请时间">{{
          this.formData.applyTime
        }}</el-descriptions-item>
        <el-descriptions-item label="申请事由">{{
          this.formData.applyReason
        }}</el-descriptions-item>
      </el-descriptions>
    </div>
    <el-divider></el-divider>
    <div class="modalCard">
      <div class="titlefangkuai">
        <div class="fangkuai"></div>
        <div class="Header">已处理业务协同处置信息</div>
      </div>
      <el-descriptions
        class="descriptions"
        :column="1"
        size="medium"
        labelClassName="label"
        contentClassName="content"
        ><el-descriptions-item label="处置意见">{{
          this.formData.collaborationInfo
        }}</el-descriptions-item></el-descriptions
      >
    </div>
    <div slot="footer">
      <div class="dialog-footer">
        <el-button @click="cancel" class="resetButton">关闭</el-button>
      </div>
    </div>
  </el-dialog>
</template>
<script>
import { getInfo } from "@/api/collaboration/collaboration";
export default {
  inheritAttrs: false,
  props: ["dialog", "collId"],
  data() {
    return {
      formData: {},
      title: "已处理业务协同详情",
    };
  },
  watch: {
    dialog: {
      handler(value) {
        //查询业务协同列表

        getInfo(this.collId).then((response) => {
          this.formData = response.data;
        });
      },
    },
  },
  methods: {
    // 取消按钮
    cancel() {
      this.$emit("update:dialog", false);
    },
  },
};
</script>
<style lang="scss" scoped>
@import "../../../../assets/styles/dialog.scss"; //模态框样式

::v-deep .label {
  width: 80px;
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 700;
  color: #5e5f61;
  display: inline-block;
  text-align: right;
}
::v-deep .content {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #aeafb0;
}
::v-deep .el-descriptions-item__container {
  margin-bottom: 15px;
}
::v-deep.el-select {
  width: 100%;
}
.dialogClass{
 ::v-deep .el-dialog{
  top: 80px;
  }
}
</style>
